<template>
	<view class="pages">
		<Header title="推广海报" :isHome="true" :isWhite="true" :bgColor="'transparent'"></Header>
		<image class="bgs" :src="imgUrl+ codeImg" mode="widthFix"></image>
		<!-- <image class="bgs" src="/static/poster.png" mode=""></image>
		<view class="ewm">
			<image src="/static/three.png" mode="" class="three"></image>
			<view class="content">
				<image  class="imgs" :src="imgUrl+ codeImg" mode="scaleToFill"></image>
				<p>
					邀请好友一起加入，推荐优质课程给朋友，赚取丰厚的佣金，创造无限的机遇
				</p>
			</view>
		</view> -->
		<view class="btns">
			<view class="btn" @click="saveImg(imgUrl+codeImg)">下载海报</view>
			<view class="btn1">
				<button class="btnfasong" :plain="true" open-type="share">
					分享给微信好友
				</button>
			</view>
		</view>
	</view>
</template>
<script>
	import {
		get,
		img_url,
		post
	} from '../../utils/request';
	export default {
		data() {
			return {
				imgUrl: img_url,
				codeImg: '',
			};
		},
		onShareAppMessage: function(res) {
			let mobile = uni.getStorageSync('userInfo').mobile
			let encodedMobile = encodeURIComponent(mobile);
			if (res.from == 'button') {
				return {
					title: '小程序分享',
					path: '/subpages/zxy/poster?mobile=' + encodedMobile,
				}
			}
		},
		onShareTimeline: function() {
			let mobile = uni.getStorageSync('userInfo').mobile
			let encodedMobile = encodeURIComponent(mobile);
			return {
				title: '小程序分享',
				path: '/subpages/zxy/poster?mobile=' + encodedMobile,
			}
		},
		onLoad(options) {
			if (options && options.query) {
				var query = options.query;
			}
			if(query && query.mobile){
				const inviteMobile = query.mobile
				console.log('邀请手机号:', inviteMobile);
				uni.setStorageSync('invite_mobile', inviteMobile)
			}
			this.getmpQrcode()
		},
		onShow() {
			const token = uni.getStorageSync('token')
			if (!token) {
				uni.showToast({
					title:'请登录后操作！',
					icon:'none'
				})
				setTimeout(function(){
					uni.redirectTo({
						url: '/subpages/login/login'
					})
				},1000)
				return
			}
		},
		methods: {
			// 获取推广二维码
			getmpQrcode() {
				const mobile = uni.getStorageSync('userInfo')
				post('/Poster/getPoster', {
						"page": "pages/index/index",
						"scene": {
							"invite_mobile": mobile.mobile
						}
					}).then(res => {
						if (res.code == 1) {
							this.codeImg = res.data
						} else {
							uni.showToast({
								title: res.msg,
								icon: 'none'
							})
						}
					})
					.catch(err => {
						console.error('GET 请求失败:', err);
					});
			}
		},
	};
</script>
<style lang='scss' scoped>
	.pages {
		width: 100%;
		min-height: 100vh;
		background: #c4f1fe;
		position: relative;

		.bgs {
			width: 100%;
			height: 570rpx;
			position: fixed;
			top: 0;
		}

		.ewm {
			padding: 20rpx 60rpx;
			height: 740rpx;
			box-sizing: border-box;
			background-color: #fff;
			border: 5rpx solid #222222;
			border-radius: 12rpx;
			margin: 0rpx 30rpx auto;
			position: relative;
			position: absolute;
			bottom: 210rpx;
			left: 0;
			right: 0;

			.three {
				width: 66rpx;
				height: 34rpx;
				position: absolute;
				top: -12rpx;
				right: 54rpx;
			}

			.content {
				display: flex;
				flex-direction: column;
				align-items: center;
				justify-content: center;
				margin-top: 60rpx;

				.imgs {
					width: 430rpx;
					height: 430rpx;
				}

				p {
					font-weight: 400;
					font-size: 32rpx;
					color: #222222;
				}
			}
		}

		.btns {
			position: fixed;
			bottom: 0;
			background: #fff;
			height: 170rpx;
			width: 100%;
			display: flex;
			align-items: center;

			.btn {
				height: 80rpx;
				line-height: 80rpx;
				margin: 0 10rpx 0 40rpx;
				color: #222222;
				/* padding: 20rpx 0; */
				border: 1rpx solid #222222;
				border-radius: 50rpx;
				text-align: center;
				flex: 1;
				font-size: 32rpx;
			}

			.btn1 {
				height: 80rpx;
				line-height: 80rpx;
				margin: 0 40rpx 0 10rpx;
				color: #222222;
				background: #ffd275;
				border: 1rpx solid #ffd275;
				/* padding: 20rpx 0; */
				border-radius: 50rpx;
				text-align: center;
				flex: 1;
			}

			.btnfasong {
				/* 清除默认边框 */
				border: none !important;
				outline: none !important;
				/*清除默认背景 */
				background-color: transparent;
				height: 80rpx;
				line-height: 80rpx;
				font-size: 32rpx;

				::after {
					border: none !important;
				}
			}
		}

	}
</style>